import {StyleSheet} from 'react-native';
import React from 'react';
import {Text} from '@rneui/themed';
import Recommendation from '../../views/home/Recommendation';
import Hot from '../../views/home/Hot';
import {createMaterialTopTabNavigator} from '@react-navigation/material-top-tabs';
const HomeTab = () => {
  const Tab = createMaterialTopTabNavigator();
  return (
    <Tab.Navigator
      initialRouteName="Recommendation"
      screenOptions={{
        tabBarScrollEnabled: true,
        tabBarItemStyle: {
          width: 'auto',
          height: 35,
          paddingTop: 0,
          marginTop: 0,
        },
        tabBarLabelStyle: {
          marginTop: 0,
        },
        tabBarIndicatorStyle: {backgroundColor: '#fb7299', width: 0.5},
        tabBarActiveTintColor: '#fb7299',
        tabBarInactiveTintColor: 'gray',
      }}>
      <Tab.Screen
        name="DirectSeeding"
        component={() => <Text>直播</Text>}
        options={{title: '直播'}}></Tab.Screen>
      <Tab.Screen
        name="Recommendation"
        component={Recommendation}
        options={{title: '推荐'}}></Tab.Screen>
      <Tab.Screen
        name="Hot"
        component={Hot}
        options={{title: '热门'}}></Tab.Screen>
      <Tab.Screen
        name="ChasingFan"
        component={() => <Text>追番</Text>}
        options={{title: '追番'}}></Tab.Screen>
      <Tab.Screen
        name="Film"
        component={() => <Text>影视</Text>}
        options={{title: '影视'}}></Tab.Screen>
      <Tab.Screen
        name="MSI"
        component={() => <Text>MSI</Text>}
        options={{title: 'MSI'}}></Tab.Screen>
      <Tab.Screen
        name="NewJourney"
        component={() => <Text>新征程</Text>}
        options={{title: '新征程'}}></Tab.Screen>
    </Tab.Navigator>
  );
};

export default HomeTab;

const styles = StyleSheet.create({
  item: {
    width: '47%',
    textAlign: 'center',
    marginBottom: 10,
    marginLeft: '2%',
    borderRadius: 5,
    backgroundColor: '#ffffff',
    shadowColor: '#333',
  },
});
